.ant-input-search {
  background-color: transparent;
  box-shadow: 0 0 7px 1px rgba(33, 152, 235, 0.3) inset;
  border: 1px solid #1197f3;
  border-radius: 5px;
  .ant-input {
    box-shadow: none;
    border: none;
  }
  .ant-input-group-addon {
    .ant-btn-default {
      background-color: transparent;
      border: none;
    }
  }
  & > .ant-input-group {
    & > .ant-input-group-addon:last-child {
      .ant-input-search-button:not(.ant-btn-primary) {
        color: #6bc2ff;
      }
    }
  }
}

.ant-tree {
  background: transparent;
  color: #fff;
  .ant-tree-list {
    .ant-tree-treenode {
      display: flex;
      width: 100%;
      padding-left: 10px;
      .ant-tree-indent {
        flex-shrink: 0;
        line-height: 40px;
      }
      .ant-tree-switcher {
        flex-shrink: 0;
        line-height: 40px;
      }
      .ant-tree-node-content-wrapper {
        flex: 1;
        border-radius: 0;
        line-height: 40px;
      }
      &:hover {
        // 第一张图165px,第三张图105px，现在需要使第二张图进行拉伸，则使用background-position和background-size进行计算
        background-image: url('@/assets/images/tree-node-l.png'),
          url('@/assets/images/tree-node-m.png'), url('@/assets/images/tree-node-r.png');
        background-position: left, 54px, right;
        background-size: 54px 40px, calc(100% - 54px - 54px) 40px, 54px 40px;
        background-repeat: no-repeat, no-repeat, no-repeat;
      }

      // 三角形
      &.ant-tree-treenode-switcher-close,
      &.ant-tree-treenode-switcher-open {
        .ant-tree-switcher {
          span {
            display: none;
          }
          &::before {
            transform: translate(-50%, -50%) rotate(0);
            transition: all 1s;
            content: '';
            position: absolute;
            width: 0;
            height: 0;
            left: 50%;
            top: 50%;
            border-left: 5px solid #56b8ff;
            border-top: 5px solid transparent;
            border-bottom: 5px solid transparent;
            transition: transform 0.1s;
          }
          // 非父节点
          &.ant-tree-switcher-noop {
            &::before {
              display: none;
            }
          }
        }
      }

      &.ant-tree-treenode-switcher-open {
        .ant-tree-switcher {
          &::before {
            transform: translate(-50%, -50%) rotate(45deg);
          }
        }
      }
      &.ant-tree-treenode-selected {
        // 第一张图165px,第三张图105px，现在需要使第二张图进行拉伸，则使用background-position和background-size进行计算
        background-image: url('@/assets/images/tree-node-l.png'),
          url('@/assets/images/tree-node-m.png'), url('@/assets/images/tree-node-r.png');
        background-position: left, 54px, right;
        background-size: 54px 40px, calc(100% - 54px - 54px) 40px, 54px 40px;
        background-repeat: no-repeat, no-repeat, no-repeat;
        .ant-tree-node-selected {
          background: transparent;
        }
      }
    }
  }
}
